<template>
  <el-dialog
    title="设置范围"
    :close-on-click-modal="false"
    :visible.sync="visible"
    top="8vh"
  >
    <el-form ref="form" :model="form" label-width="90px" :rules="rules">
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="活动名称" prop="hdName">
            <el-input v-model="form.hdName" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="票关键字" prop="cppName">
            <el-input v-model="form.cppName" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="备注">
            <el-input v-model="form.markName" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-button type="primary" @click="searchBtn('form')">检索</el-button>
          <el-button type="primary" @click="summaryBtn">生成汇总表</el-button>
        </el-col>
      </el-row>
      <el-table
        :data="tableData"
        style="width: 100%"
        @selection-change="handleSelectionChange"
        max-height="450"
      >
        @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column prop="hdName" label="活动名称" align="center">
        </el-table-column>
        <el-table-column prop="cppName" label="票名称" align="center">
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" align="center">
          <template slot-scope="scope">
            {{ $moment(scope.row.createTime).format("YYYY-MM-DD") }}
          </template>
        </el-table-column>
        <el-table-column prop="createUserName" label="创建人" align="center">
        </el-table-column>
      </el-table>
    </el-form>
  </el-dialog>
</template>

<script>
import { getHdHzList, addObj, fetchList } from "@/api/ceping/cepinghzglhdfwbhz";
export default {
  data() {
    return {
      visible: false,
      form: {},
      tableData: [],
      pageIndex: 1,
      pageSize: 100,
      multipleSelection: [],
      id: "",
      rules: {
        // hdName: [
        //   { required: true, message: "请输入活动名称", trigger: "blur" },
        // ],
        cppName: [
          { required: true, message: "请输入票关键字", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    init(data) {
      this.id = data.id;
     //console.log(data);
      this.visible = true;
      this.tableData = [];
      this.getfetchList();
    },
    getgetHdHzList() {
      var params = {
        current: this.pageIndex,
        size: this.pageSize,
      };
      getHdHzList(Object.assign(params, this.form)).then((res) => {
       //console.log(res);
        this.tableData = res.data.data;
      });
    },
    getfetchList() {
      fetchList({ hzId: this.id }).then((res) => {
        this.tableData = res.data.data.records;
      });
    },
    searchBtn(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.getgetHdHzList();
        } else {
          return false;
        }
      });
    },
    summaryBtn() {
      if (this.multipleSelection.length < 1) {
        this.$message.warning("请勾选数据");
      } else {
        addObj(this.multipleSelection).then((res) => {
         //console.log(res);
          if (res.data.code == 0) {
            this.$message.success("设置成功");
            this.visible = false;
            this.$emit("refreshDataList");
          } else {
            this.$message.warning("模板不一致");
          }
        });
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
      val.forEach((item) => {
        item.hzId = this.id;
      });
     //console.log(this.multipleSelection);
    },
  },
};
</script>
